<template>
	<view class="">
		<view class="box" :style="{background: uerData.img && 'url('+ uerData.img +')no-repeat'}">
		</view>
		<!-- <view class=""> -->
			<haderBack></haderBack>
			<view class="infosned">
				<view class="userinfo_img">
					<u-avatar size='180'  mode="square" class='tox' :src="uerData.img || '../../../../../static/logo.png'" show-sex></u-avatar>
					<!-- <image src="../../../../../static/logo.png" mode=""></image> -->
				</view>
				<view>
					<text class="userinfo_txt">{{uerData.usermali}}</text>
					<view class="">
						呢称：{{uerData.nickname}}
					</view>
					<view class="userinfo_msg">{{uerData.msg}}</view>
				</view>
			</view>
			<view class="oko" v-if="usermali !== uerData.usermali" @click="saveuser">加好友 </view>
		<!-- </view> -->
	</view>
</template>

<script>
	import {
		getState
	} from "../../../../../store";
	export default {
		data() {
			return {
				uerData :{},
				uerid:'',
				usermali:'',
			}
		},
		onLoad(data) {
			this.uerData = data.data && JSON.parse(decodeURIComponent(data.data));
			uni.getStorage({
			    key: 'userInfo',
			    success:  (res)=> {
					Object.values(data).length === 0 && (this.uerData = res.data);
					this.usermali = res.data.usermali
			    }
			});
		},
	
		methods: {
		async	saveuser() {
				
				await this.http(this.api.myuseradd,{friend_my:this.uerData.uerid})
				uni.showToast({
				  icon: "success",
				  position: "bottom",
				  title: "操作成功",
				});
			},
			evenMore() {

			}
		}
	}
</script>

<style scoped lang="less">
	@import '../../../../../static/css/common.less';
	uni-view, uni-text{
		    box-sizing: border-box;
		    text-align: center;
	}
	.box {
		width: 100vw;
		height: 100vh;
		background: url(../../../../../static/logo.png) no-repeat;
		filter: blur(5px);
		zoom: 1;
		position: fixed;
		top: 0px;
		background-attachment: fixed;
		background-repeat: no-repeat;
		background-size: cover;
		-webkit-background-size: cover;
		-o-background-size: cover;
		background-position: center 0;

	}
	
	
	.infosned {
		padding: 50rpx;
		width: 100vw;
		height: 80vh;
		position: fixed;
		bottom: 10vh;
		border-radius: 26rpx 26rpx 0px 0px;
	
		.userinfo_txt {
			width: 100vw;
			font-family: PingFangSC-Regular;
			font-size: 52rpx;
			color: #272832;
			letter-spacing: -0.89px;
		}
	
		.userinfo_img {
			display: flex;
			align-items: center;
			justify-content: center;
			margin: auto;
			width: 200rpx;
			height: 200rpx;
			background-color: #24292E;
			border-radius: 14%;
			background: linear-gradient(129deg, #d4d4d4, #fbfbfb);
			box-shadow: -2px 1px 100px #d4d4d4, -1px 2px 0px #ffffff;
	
			image {
				width: 90%;
				height: 90%;
				border-radius: 14%;
			}
		}
	}
	
	.oko {
		padding: 50rpx;
		background: #FFE431;
		border-radius: 10rpx;
		width: 84%;
		margin-left: 8%;
		position: fixed;
		bottom: 8vh;
		.fontFamily();
		letter-spacing: -0.55px;
		.centered();
		height: 4vh;
	}
</style>
